<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>天翊博客登录界面</title>
<link href="./css/nodejs.css" rel="stylesheet">
<style>
* {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	padding: 0;
	background: #e1e1e1;
}

a {
	text-decoration: none;
}

.head {
	width: 100%;
	height: 50px;
	background: blue;
}

.main {
	width: auto;
	height: 530px;
	margin: 15px 24px;
}

.main-left {
	width: 68%;
	height: 100%;
	float: left;
	background: #fff;
	margin: 0;
	padding: 0;
}

.main-right {
	width: 30%;
	height: 100%;
	float: right;
	background: #fff;
	margin: 0;
	padding: 0;
}




.login-title {
	background: #f6f6f6;
	width: auto;
	height: 20px;
	padding: 10px;
}

.login-title .text1 a {
	color: #80bd01;
	text-shadow: none;
	text-decoration: none;
	font-size: 14px;
}

.login-title .text2 {
	color: #ccc;
	font-size: 14px;
}

.login-title .text3 {
	color: #999;
	font-size: 14px;
}

.login-table {
	background: #fff;
	width: 100%;
}

.login-username {
	width: 360px;
	height: 30px;
	margin: 20px auto 20px auto;
}

.login-table label {
	width: 60px;
	float: left;
	font-size: 14px;
	height: 30px;
	line-height: 30px;
	text-align: right;
}

.input {
	width: 278px;
	height: 20px;
	padding: 4px 6px;
	margin: 0px;
	border: 1px solid #888;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	float: right;
}

.input:focus {
	border-color: rgba(82, 168, 236, .8);
	outline: 0;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px
		rgba(82, 168, 236, .6);
}

.login-password {
	width: 360px;
	height: 30px;
	margin: auto;
}

.login-buttons {
	width: 300px;
	height: 40px;
	margin: auto;
	text-align: right;
	margin-top: 30px;
}

.button {
	height: 40px;
	line-height: 40px;
	text-align: center;
	padding: 8px 10px 8px 10px;
	background: #08c;
	color: #fff;
	font-size: 13px;
	text-shadow: none;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.button:hover {
	background: #05c;
}

.button-light {
	background-color: #5bc0de;
}

.button-light:hover {
	background-color: #2f96b4;
}

.wangjimima:hover {
	text-decoration: underline;
}

.main-right-title {
	height: 40px;
	width: auto;
	background-color: #f6f6f6;
	line-height: 40px;
	padding-left: 20px;
	color: #444;
}

.main-right-text span {
	display: block;
	padding: 10px 10px 10px 20px;
}

.main-right-text li {
	padding: 10px 10px 10px 20px;
	font-size: 10px;
}
</style>
</head>
<body>
	<div class="nav_head">
		<div class="nav_two">
			<div class="nav_three">
				<a class="logo_href" href="#"> <img class="logo"
					src="./img/cnodejs_light.svg" />
				</a> <input class="search" type="text" />
				<ul class="nav_ul">
					<li><a href="#">首页</a></li>
					<li><a href="#">新手入门</a></li>
					<li><a href="#">API</a></li>
					<li><a href="#">关于</a></li>
					<li><a href="#">注册</a></li>
					<li><a href="#">登录</a></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="main">
		<div class="main-left">
			<div class="login-title">
				<span class="text1"> <a href="./nodejs.html">主页</a>
				</span> <span class="text2">/</span> <span class="text3">登录</span>
			</div>
			<div class="login-table">
				<form action="/regist" method="post">
					${msg}
					<div class="login-username">
						<label>用户名</label> <input name="count" id="count" type="text" class="input">
					</div>
					<div class="login-username">
						<label>密码</label> <input name="password" id="password" type="password" class="input">
					</div>
					<div class="login-username">
						<label>确认密码</label> <input name="passwordTo" id="passwordTo" type="password" class="input">
					</div>
					<div class="login-username">
						<label>昵称</label> <input name=nike id="headImg" type="text" class="input">
					</div>
					<div class="login-username">
						<label>头像</label> <input name="headImg" id="headImg" type="text" class="input">
					</div>
					<div class="login-username">
						<label>签名</label> <input name="sign" id="sign" type="text" class="input">
					</div>
					<div class="login-username">
						<label>邮箱</label> <input name="email" id="email" type="text" class="input">
					</div>
					<div class="login-username">
						<label>手机号码</label> <input name="tel" id="tel" type="text" class="input">
					</div>
					<div class="login-buttons">
						<input type="submit" value="登录" />
						<a class="button" href="#">登录</a> <a class="button button-light"
							href="#">点击马上注册</a> <a class="wangjimima" href="#"><span>忘记密码了？</span></a>
					</div>
				</form>
			</div>
		</div>
		<div class="main-right">
			<div class="main-right-title">关于</div>
			<div class="main-right-text">
				<span>CNode：Node.js专业中文社区</span> <span>在这里你可以：</span>
				<li>向别人提出你遇到的问题</li>
				<li>帮助遇到问题的人</li>
				<li>分享自己的知识</li>
				<li>和其它人一起进步</li>
			</div>
		</div>
	</div>
	<jsp:include page="footer.jsp"></jsp:include>
	<script>
		var username = document.getElementById("username");
		console.log(username);
		var y=document.getElementsByTagName("a");
		console.log(y)
	</script>
</body>
</html>